<%@ page contentType="text/html;charset=UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <meta name="renderer" content="webkit">
    <title></title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/admin/css/pintuer.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/admin/css/admin.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/admin/css/bootstrap.min.css">

    <script src="${pageContext.request.contextPath}/admin/js/jquery.js"></script>
    <script src="${pageContext.request.contextPath}/admin/js/pintuer.js"></script>
    <script src="${pageContext.request.contextPath}/admin/js/jquery.min.js"></script>
    <script src="${pageContext.request.contextPath}/admin/js/bootstrap.min.js"></script>
    <script>
        // 图片上传后预览
        function Uploadpicture() {
            $("#File2").trigger("click");
        }

        function changepic(f) {
            var rd = new FileReader();
            var files = f.files[0];
            rd.readAsDataURL(files);
            rd.onloadend = function (ev) {
                var url1 = document.getElementById("url2");
                url1.setAttribute("data-image", this.result);
                var fliename = document.getElementById("File2").value;
                $("#url2").val(fliename);
            }
        }

        function edit(id) {
            $("#sort").val(id);
            $("#Id").val(id);
            location.href = "#add";
        }

        function showorhidden(name) {
            var id = document.getElementById(name);
            id.style.display = id.style.display == 'none' ? 'block' : 'none';

            var val = $("#click").val();
            val == '有图资讯' ? $("#click").val('无图资讯') : $("#click").val('有图资讯');

            var pict = $("#pict").val();
            pict == 'yes' ? $("#pict").val('no') : $("#pict").val('yes');
        }

        function del(id) {
            if(confirm('你确定要删除吗?')){
                location.href = '${pageContext.request.contextPath}/InfoServlet?method=deleteInfo&id=' + id;
            } else {
                // 不删除
            }
        }

        function changesearch1() {
            var str = $("#search1").val();
            location.href = '${pageContext.request.contextPath}/InfoServlet?method=searchInfo&search=' + str + '&Pexpand=true&Pclass1=active&Pclass2=active in&flag=1';
        }

        function changesearch2() {
            var str = $("#search2").val();
            location.href = '${pageContext.request.contextPath}/InfoServlet?method=searchInfo&search=' + str + '&Nexpand=true&Nclass1=active&Nclass2=active in&Pexpand=false&Pclass1=1&Pclass2=1';
        }
    </script>

</head>
<body>
<div class="panel admin-panel">
    <div class="panel-head"><strong><span class="icon-pencil-square-o"></span> 内容管理</strong></div>
    <style>
        table {
            margin-left: 10px;
            margin-top: 10px;
        }
    </style>
    <ul id="myTab" class="nav nav-tabs">
        <li class="${Pclass1}"><a href="#hp" data-toggle="tab" aria-expanded="${Pexpand}">带图资讯</a></li>
        <li class="${Nclass2}"><a href="#np" data-toggle="tab" aria-expanded="${Nexpand}">无图资讯</a></li>
    </ul>
    <div id="myTabContent" class="tab-content">
        <div class="tab-pane fade ${Pclass2}" id="hp">
            <div style="height: 10px"></div>
            <li>
                <input type="text" placeholder="请输入搜索关键字" name="keywords" class="input" id="search1"
                       style="width:250px; line-height:17px;display:inline-block"/>
                <a class="button border-main icon-search" onclick="changesearch1()"> 搜索</a>
            </li>
            <table class="table table-hover text-center">
                <tr>
                    <th width="5%">序号</th>
                    <th>标题</th>
                    <th>图片</th>
                    <th>URL</th>
                    <th width="250">操作</th>
                </tr>
                <%--有图部分--%>
                <c:choose>
                    <%--显示数据库内容--%>
                    <c:when test="${info==null}">
                        <c:set var="i" value="0"/>
                        <c:forEach items="${picInfo.list}" var="info" varStatus="st">
                            <c:if test="${info.picture}">
                                <c:set var="i" value="${i+1}"/>
                                <tr>
                                <td>${i}</td>
                                <td>${info.title}</td>
                                <td><img src="${pageContext.request.contextPath}/${info.address}?random=${randomNum}" alt="" width="120"
                                         height="50"/>
                                </td>
                                <td>${info.url}</td>
                                <td>

                                <div class="button-group">
                                    <button type="button" class="button border-main" data-target="#myModal${i}"
                                            data-toggle="modal"><span class="icon-edit"></span>修改
                                    </button>
                                    <div class="modal fade" id="myModal${i}" tabindex="-1" role="dialog"
                                         aria-labelledby="myModalLabel">
                                        <div class="modal-dialog">
                                            <div class="modal-content">
                                                <div class="modal-header">
                                                    <button data-dismiss="modal" class="close" type="button">
                                                        <span class="sr-only">Close</span>
                                                    </button>
                                                    <h4 class="modal-title">提问</h4>
                                                </div>
                                                <form action="${pageContext.request.contextPath}/InfoServlet?method=updateInfo&id=${info.id}" method="post" enctype="multipart/form-data">
                                                    <div class="modal-body form-group">
                                                        <p>新闻标题</p>
                                                        <input class="form-control" type="text" name="title" value="${info.title}">
                                                        <p style="margin-top:10px ">更换图片</p>
                                                        <input class="form-control a-upload" type="file" style="padding-left: 35%; padding-bottom: 35px" name="img">
                                                        <p style="margin-top:10px ">链接URL</p>
                                                        <input class="form-control" type="text" name="url" value= "${info.url}">
                                                    </div>

                                                    <div class="modal-footer">
                                                        <button data-dismiss="modal" class="btn btn-default" type="button">关闭
                                                        </button>
                                                        <button class="btn btn-primary" type="submit">提交</button>
                                                    </div>
                                                </form>
                                            </div>
                                        </div>
                                    </div>
                                    <a class="button border-red" onclick="del('${info.id}','${info.address}')" style="text-decoration: none"><span class="icon-trash-o"></span>删除</a>
                                </div>
                            </c:if>
                            </tr>
                        </c:forEach>
                    </c:when>
                    <c:otherwise>
                        <%--显示搜索结果--%>
                        <c:forEach items="${info}" var="info" >

                            <c:if test="${info.picture}">
                                <c:set var="i" value="${i+1}"/>
                                <tr>
                                <td>${i}</td>
                                <td>${info.title}</td>
                                <td><img src="${pageContext.request.contextPath}/${info.address}?random=${randomNum}" alt="" width="120"
                                         height="50"/>
                                </td>
                                <td>${info.url}</td>
                                <td>

                                <div class="button-group">
                                    <button type="button" class="button border-main" data-target="#myModal${i}"
                                            data-toggle="modal"><span class="icon-edit"></span>修改
                                    </button>
                                    <div class="modal fade" id="myModal${i}" tabindex="-1" role="dialog"
                                         aria-labelledby="myModalLabel">
                                        <div class="modal-dialog">
                                            <div class="modal-content">
                                                <div class="modal-header">
                                                    <button data-dismiss="modal" class="close" type="button">
                                                        <span class="sr-only">Close</span>
                                                    </button>
                                                    <h4 class="modal-title">提问</h4>
                                                </div>
                                                <form action="${pageContext.request.contextPath}/InfoServlet?method=updateInfo&id=${info.id}" method="post" enctype="multipart/form-data">
                                                    <div class="modal-body form-group">
                                                        <p>新闻标题</p>
                                                        <input class="form-control" type="text" name="title" value="${info.title}">
                                                        <p style="margin-top:10px ">更换图片</p>
                                                        <input class="form-control a-upload" type="file" style="padding-left: 35%; padding-bottom: 35px" name="img">
                                                        <p style="margin-top:10px ">链接URL</p>
                                                        <input class="form-control" type="text" name="url" value= "${info.url}">
                                                    </div>

                                                    <div class="modal-footer">
                                                        <button data-dismiss="modal" class="btn btn-default" type="button">关闭
                                                        </button>
                                                        <button class="btn btn-primary" type="submit">提交</button>
                                                    </div>
                                                </form>
                                            </div>
                                        </div>
                                    </div>
                                    <a class="button border-red" onclick="del(${info.id})" style="text-decoration: none"><span class="icon-trash-o"></span>删除</a>
                                </div>
                            </c:if>
                            </tr>
                        </c:forEach>
                    </c:otherwise>
                </c:choose>
                <tr>
                    <td></td><td></td><td></td><td></td><td></td><td></td>
                </tr>
                <tr>
                    <td colspan="5">
                        <div class="pagelist">
                            <c:if test="${picInfo.pageNo != 1}">
                                <a style="text-decoration: none" href="${pageContext.request.contextPath}/InfoServlet?method=adminGetInfo&page1=${picInfo.pageNo - 1}&Pexpand=true&Pclass1=active&Pclass2=active in&flag=1">上一页</a>
                            </c:if>
                            <c:forEach begin="1" end="${picInfo.totalPage}" var="i">
                                <a style="text-decoration: none" href="${pageContext.request.contextPath}/InfoServlet?method=adminGetInfo&page1=${i}&Pexpand=true&Pclass1=active&Pclass2=active in&flag=1">${i}</a>
                            </c:forEach>
                            <c:if test="${picInfo.pageNo + 1 <= picInfo.totalPage}">
                                <a style="text-decoration: none" href="${pageContext.request.contextPath}/InfoServlet?method=adminGetInfo&page1=${picInfo.pageNo + 1}&Pexpand=true&Pclass1=active&Pclass2=active in&flag=1">下一页</a>
                            </c:if>
                        </div>
                    </td>
                </tr>
            </table>
        </div>
        <div class="tab-pane fade ${Nclass2}" id="np">
            <div style="height: 10px"></div>
            <li>
                <input type="text" placeholder="请输入搜索关键字" name="keywords" class="input" id="search2"
                       style="width:250px; line-height:17px;display:inline-block"/>
                <a class="button border-main icon-search" onclick="changesearch2()"> 搜索</a>
            </li>
            <table class="table table-hover text-center">
                <tr>
                    <th width="5%">序号</th>
                    <th>标题</th>
                    <th>URL</th>
                    <th width="250">操作</th>
                </tr>
                <%--无图部分--%>
                <c:choose>
                    <%--显示数据库内容--%>
                    <c:when test="${info==null}">

                        <c:set var="j" value="0"/>
                        <c:forEach items="${noPicInfo.list}" var="info" varStatus="st">
                            <c:if test="${!info.picture}">
                                <c:set var="i" value="${i+1}"/>
                                <c:set var="j" value="${j+1}"/>
                                <tr>
                                    <td>${j}</td>
                                    <td>${info.title}</td>
                                    <td>${info.url}</td>
                                    <td>
                                        <div class="button-group">
                                            <button type="button" class="button border-main" data-target="#myModal${i}"
                                                    data-toggle="modal"><span class="icon-edit"></span>修改
                                            </button>
                                            <div class="modal fade" id="myModal${i}" tabindex="-1" role="dialog"
                                                 aria-labelledby="myModalLabel">
                                                <div class="modal-dialog">
                                                    <div class="modal-content">
                                                        <div class="modal-header">
                                                            <button data-dismiss="modal" class="close" type="button">
                                                                <span class="sr-only">Close</span>
                                                            </button>
                                                            <h4 class="modal-title">提问</h4>
                                                        </div>
                                                        <form action="${pageContext.request.contextPath}/InfoServlet?method=updateInfo&id=${info.id}" method="post" enctype="multipart/form-data">
                                                            <div class="modal-body">
                                                                <p>新闻标题</p>
                                                                <input class="form-control" name="title">
                                                                <p style="margin-top: 10px">链接URL</p>
                                                                <input class="form-control" name="url">
                                                            </div>
                                                            <div class="modal-footer">
                                                                <button data-dismiss="modal" class="btn btn-default" type="button">
                                                                    关闭
                                                                </button>
                                                                <button class="btn btn-primary" type="submit">提交</button>
                                                            </div>
                                                        </form>
                                                    </div>
                                                </div>
                                            </div>
                                            <a class="button border-red" href="javascript:void(0)" onclick="del(${info.id})" style="text-decoration: none">
                                                <span class="icon-trash-o">删除</span>
                                            </a>
                                        </div>
                                    </td>
                                </tr>
                            </c:if>
                        </c:forEach>
                    </c:when>
                    <c:otherwise>
                        <%--显示搜索结果--%>
                        <c:set var="j" value="0"/>
                        <c:forEach items="${info}" var="info">
                            <c:if test="${!info.picture}">
                                <c:set var="i" value="${i+1}"/>
                                <c:set var="j" value="${j+1}"/>
                                <tr>
                                    <td>${j}</td>
                                    <td>${info.title}</td>
                                    <td>${info.url}</td>
                                    <td>
                                        <div class="button-group">
                                            <button type="button" class="button border-main" data-target="#myModal${i}"
                                                    data-toggle="modal"><span class="icon-edit"></span>修改
                                            </button>
                                            <div class="modal fade" id="myModal${i}" tabindex="-1" role="dialog"
                                                 aria-labelledby="myModalLabel">
                                                <div class="modal-dialog">
                                                    <div class="modal-content">
                                                        <div class="modal-header">
                                                            <button data-dismiss="modal" class="close" type="button">
                                                                <span class="sr-only">Close</span>
                                                            </button>
                                                            <h4 class="modal-title">提问</h4>
                                                        </div>
                                                        <form action="${pageContext.request.contextPath}/InfoServlet?method=updateInfo&id=${info.id}" method="post" enctype="multipart/form-data">
                                                            <div class="modal-body">
                                                                <p>新闻标题</p>
                                                                <input class="form-control" name="title">
                                                                <p style="margin-top: 10px">链接URL</p>
                                                                <input class="form-control" name="url">
                                                            </div>
                                                            <div class="modal-footer">
                                                                <button data-dismiss="modal" class="btn btn-default" type="button">
                                                                    关闭
                                                                </button>
                                                                <button class="btn btn-primary" type="submit">提交</button>
                                                            </div>
                                                        </form>
                                                    </div>
                                                </div>
                                            </div>
                                            <a class="button border-red" href="javascript:void(0)" onclick="del(${info.id})" style="text-decoration: none">
                                                <span class="icon-trash-o">删除</span>
                                            </a>
                                        </div>
                                    </td>
                                </tr>
                            </c:if>
                        </c:forEach>
                    </c:otherwise>
                </c:choose>

                <tr>
                    <td></td><td></td><td></td><td></td><td></td><td></td>
                </tr>
                <tr>
                    <td colspan="4">
                        <div class="pagelist">
                            <c:if test="${noPicInfo.pageNo != 1}">
                                <a style="text-decoration: none" href="${pageContext.request.contextPath}/InfoServlet?method=adminGetInfo&page2=${noPicInfo.pageNo - 1}&Nexpand=true&Nclass1=active&Nclass2=active in&Pexpand=false&Pclass1=1&Pclass2=1">上一页</a>
                            </c:if>
                            <c:forEach begin="1" end="${noPicInfo.totalPage}" var="i">
                                <a style="text-decoration: none" href="${pageContext.request.contextPath}/InfoServlet?method=adminGetInfo&page2=${i}&Nexpand=true&Nclass1=active&Nclass2=active in&flag=1&Pexpand=false&Pclass1=1&Pclass2=1">${i}</a>
                            </c:forEach>
                            <c:if test="${noPicInfo.pageNo + 1 <= noPicInfo.totalPage}">
                                <a style="text-decoration: none" href="${pageContext.request.contextPath}/InfoServlet?method=adminGetInfo&page2=${noPicInfo.pageNo + 1}&Nexpand=true&Nclass1=active&Nclass2=active in&Pexpand=false&Pclass1=1&Pclass2=1">下一页</a>
                            </c:if>
                        </div>
                    </td>
                </tr>
            </table>
        </div>
    </div>

    <div class="panel-head"><strong><span class="icon-pencil-square-o"></span> 增加内容</strong></div>
    <div class="body-content">
        <form method="post" class="form-x" action="${pageContext.request.contextPath}/InfoServlet?method=addInfo" enctype="multipart/form-data">
            <div class="form-group">
                <div class="label">
                    <label>标题：</label>
                </div>
                <div class="field">
                    <input type="text" class="input w50" value="" name="title" data-validate="required:请输入标题"/>
                    <div class="tips"></div>
                </div>
            </div>
            <div class="form-group">
                <div class="label">
                    <label>URL：</label>
                </div>
                <div class="field">
                    <input type="text" class="input w50" value="" name="url" data-validate="required:请输入链接"/>
                    <div class="tips"></div>
                </div>
            </div>

            <div class="form-group">
                <div class="label">
                    <label></label>
                </div>
                <div class="button-group">
                    <input type="button" id="click" onclick="showorhidden('hiddener')"
                           class="button bg-blue margin-left" value="无图资讯" style="float:left;"></div>
                <input type="hidden" name="pict" value="yes" id="pict">
            </div>

            <div class="form-group" id="hiddener" style="display: block">
                <div class="label">
                    <label>图片：</label>
                </div>
                <div class="field">
                    <input type="text" id="url2" name="img" class="input tips" style="width:25%; float:left;"
                           data-toggle="hover" data-place="right" data-image=""/>
                    <input type="file" style="display: none" id="File2" name="pic" onchange="changepic(this)">
                    <input type="button" class="button bg-blue margin-left" id="image2" value="+ 浏览上传"
                           style="float:left;" onclick="Uploadpicture();">
                    <div class="tipss">图片尺寸：1920*500</div>
                </div>
            </div>

            <div class="clear"></div>
            <div class="form-group">
                <div class="label">
                    <label></label>
                </div>
                <div class="field">
                    <button class="button bg-main icon-check-square-o" type="submit">提交</button>
                </div>
            </div>
        </form>
    </div>
</div>
</body>
</html>
